<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			* {
				padding: 0;
				margin: 0;
			}
			
			ul li {
				width: 200px;
				height: 20px;
				text-align: center;
				border: 1px solid black;
			}
			
			ul li #zs {
				width: 30px;
				height: 20px;
				border: 1px solid black;
			}
		
		</style>
	</head>

	<body>
		<input type="button" value="删除" /><br />
		<p id="sum"></p>
		<ul>
			<li>
				<div class="zs"> <input type="checkbox" </div>
					<td class="fjr">发件人</td>
					<td class="zt">主题</td>
					<td class="sj">时间</td>
			</li>
			<li>
				<div class="zs"> <input type="checkbox" </div>
					<td class="fjr">zs</td>
					<td class="zt">这只是个例子</td>
					<td class="sj">shiji22an</td>
			</li>
			<li>
				<div class="zs"> <input type="checkbox" </div>
					<td class="fjr">zs</td>
					<td class="zt">这只是个例子</td>
					<td class="sj">shiji22an</td>
			</li>
			<li>
				<div class="zs"> <input type="checkbox" </div>
					<td class="fjr">zs</td>
					<td class="zt">这只是个例子</td>
					<td class="sj">shiji22an</td>
			</li>
			<li>
				<div class="zs"> <input type="checkbox" </div>
					<td class="fjr">zs</td>
					<td class="zt">这只是个例子</td>
					<td class="sj">shiji22an</td>
			</li>
			<li>
				<div class="zs"> <input type="checkbox" </div>
					<td class="fjr">zs</td>
					<td class="zt">这只是个例子</td>
					<td class="sj">shiji22an</td>
			</li>
 
		</ul>

		<script>
			var sum = document.getElementById('sum');
			var inputs = document.getElementsByTagName('input');
            var add=0;
			for(var j = 0; j < inputs.length; j++) {
				inputs[j].onclick = function() {
				    add = 0;
					for(var i = 2; i < inputs.length; i++) {
						if(inputs[i].checked) {
							add++;
						}
					}
				}
			}
			var count = inputs.length - 1;
			sum.innerHTML = '一共' + count + '选中' + add;
		</script>
	</body>

</html>